<template>
  <div class="login">
    <v-card
        elevation="2"
        class="mx-auto my-12"
    >
      <v-card-title>
        登录
      </v-card-title>
      <v-card-subtitle>
        Login
      </v-card-subtitle>
      <v-card-actions>
        <div style="width: 500px;height: 400px">
          <div style="display: flex;align-items: center;margin-right: 15px;margin-top: 35px">
            <span style="margin-right: 15px;width: 75px">用户名：</span>
            <v-text-field label="用户名"></v-text-field>
          </div>

          <div style="display: flex;align-items: center;margin-right: 15px">
            <span style="margin-right: 15px;width: 75px">密码：</span>
            <v-text-field type="password" label="密码"></v-text-field>
          </div>
          <div style="display: flex;justify-content: center;width: 100%;margin-top: 55px">
            <v-btn @click="LoginBtn">登录</v-btn>
          </div>
        </div>

      </v-card-actions>
    </v-card>
  </div>
</template>

<script>
export default {
  name: "Login",
  methods: {
    LoginBtn() {
      this.$router.push("/admin")
    }
  }
}
</script>

<style scoped>
.login {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;
}
</style>